<template>
  <view class="login-container" :data-theme="theme()" :class="theme() || ''">
    <view class="skip" @click="gotoPage('/pages/index/index')">{{ $t('login.skip_arrow') }}</view>
    <view class="" v-if="is_login != 0">
      <view class="login_topbpx">
        <view class="login_tit" v-if="is_login == 2">{{ $t('login.quick_login') }}</view>
        <view class="login_tit" v-if="is_login == 1">{{ $t('login.account_login') }}</view>
        <view class="login_top" v-if="is_login == 2">{{ $t('login.auto_register_first_time') }}</view>
      </view>
      <view class="group-bd">
        <view class="form-level d-s-c">
          <input class="login-input" :adjust-position="false" type="text" v-model="formData.mobile"
            :placeholder="$t('login.enter_phone_number')" :disabled="is_send" />
        </view>
        <view class="form-level d-s-c" v-if="is_login == 1">
          <input class="login-input" :adjust-position="false" type="text" password="true" v-model="formData.password"
            :placeholder="$t('login.enter_password')" />
          <button class="get-code-btn" @click="is_login = 0">{{ $t('login.forgot_password_question') }}</button>
        </view>
        <view class="form-level d-b-c" v-if="is_login == 2 && sms_open">
          <input class="login-input" type="number" v-model="formData.code"
            :placeholder="$t('login.enter_verification_code')" />
          <button class="get-code-btn" @click="sendCode" :disabled="is_send">
            {{ send_btn_txt }}
          </button>
        </view>
      </view>
    </view>
    <view class="" v-if="is_login == 0">
      <view class="login_topbpx">
        <view class="login_tit">{{ $t('login.recover_password') }}</view>
        <view class="login_top">{{ $t('login.phone_binding_confirmation') }}</view>
      </view>
      <view class="group-bd">
        <view class="form-level d-s-c">
          <view class="val flex-1"><input type="text" v-model="resetpassword.mobile"
              :placeholder="$t('login.enter_phone_number')" :disabled="is_send" /></view>
        </view>
        <view class="form-level d-s-c">
          <view class="val flex-1 d-b-c">
            <input class="flex-1" :adjust-position="false" type="number" v-model="resetpassword.code"
              :placeholder="$t('login.enter_verification_code')" />
            <button class="get-code-btn" @click="sendCode" :disabled="is_send">
              {{ send_btn_txt }}
            </button>
          </view>
        </view>
        <view class="form-level d-s-c">
          <view class="val flex-1"><input type="text" :adjust-position="false" password="true"
              v-model="resetpassword.password" :placeholder="$t('login.enter_password')" /></view>
        </view>
        <view class="form-level d-s-c">
          <view class="val flex-1"><input type="text" :adjust-position="false" password="true"
              v-model="resetpassword.repassword" :placeholder="$t('login.reenter_password')" /></view>
        </view>
      </view>
    </view>
    <view @click="isRead = !isRead" class="d-s-c gray6 mt30" style="flex-wrap: wrap;">
      <view class="icon iconfont icon-tijiaochenggong" :class="isRead ? 'active agreement' : 'agreement'"></view>
      {{ $t('login.agree_to_terms') }}
      <text class="dominant" @click="xieyi('service')"> {{ $t('login.user_agreement0') }}</text> {{ $t('login.and') }}
      <text class="dominant" @click="xieyi('privacy')">{{ $t('login.privacy_policy0') }}</text>
    </view>
    <button v-if="is_login == 2" class="theme-btn sub-btn" @click="formSubmit"> {{ $t('login.login_now') }}

    </button>
    <button v-if="is_login == 1" class="theme-btn sub-btn" @click="formSubmit"> {{ $t('login.login_now') }}

    </button>
    <button v-if="is_login == 0" class="theme-btn sub-btn" @click="resetpasswordSub"> {{ $t('login.confirm') }}

    </button>
    <view class="f30 gray6 d-c-c">
      <view v-if="is_login == 1" @click="is_login = 2">{{ $t('login.phone_login') }}</view>
      <view v-if="is_login == 2" @click="is_login = 1">{{ $t('login.account_login') }}</view>
      <view v-if="is_login == 0" @click="is_login = 1">{{ $t('login.login_now') }}</view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      /*表单数据对象*/
      formData: {
        /*手机号*/
        mobile: "",
        password: "",
        /*验证码*/
        code: ""
      },
      resetpassword: {
        mobile: "",
        password: "",
        repassword: "",
        code: ""
      },
      /*是否已发验证码*/
      is_send: false,
      /*发送按钮文本*/
      send_btn_txt: this.$t("login.get_verification_code"),
      /*当前秒数*/
      second: 60,
      ip: "",
      is_login: 2,
      sms_open: false,
      isRead: false
    };
  },
  onLoad(e) {
    // this.getData();
    // let self = this;
    // if (e.invitationId) {
    // 	uni.setStorageSync('invitationId', e.invitationId);
    // }
    // if (e.refereeId) {
    // 	uni.setStorageSync('refereeId', e.refereeId);
    // }
  },
  onShow() {
    this.getCodeType();
    // this.init()
    uni.setNavigationBarTitle({
      title: this.$t('login.login')
    })
  },
  methods: {
    xieyi(type) {
      this.gotoPage("/pages/webview/ue?type=" + type);
    },
    getCodeType() {
      let self = this;
      self._get("index/loginSetting", {}, res => {
        self.sms_open = res.data.h5SmsOpen;
        if (!self.sms_open) {
          self.is_login = 1;
        }
        // self.is_code = self.sms_open;
      });
    },
    /*初始化*/
    // init() {
    // 	let self = this;
    // 	uni.getSystemInfo({
    // 		success(res) {
    // 			self.phoneHeight = res.windowHeight;
    // 		}
    // 	});
    // },
    // getData(){
    // 	let self = this;
    // 	self._get('index/policy', {}, function(res) {
    // 		self.service = res.data.service;
    // 		self.privacy = res.data.privacy;
    // 	});
    // },
    /*提交*/
    formSubmit() {
      let self = this;
      if (!self.isRead) {
        uni.showToast({
          title: this.$t("login.read_and_accept_agreement"),
          duration: 2000,
          icon: "none"
        });
        return;
      }
      let formdata = {
        mobile: self.formData.mobile,
        invitationId: self.invitationId || 0,
        refereeId: uni.getStorageSync("refereeId") || 0
      };
      let url = "";
      if (self.formData.mobile == "") {
        uni.showToast({
          title: self.$t('user.enter_mobile_number'),
          duration: 1000,
          icon: "none",
        });
        return false;
      }
      // if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.formData.mobile)) {
      //   console.log(self.formData.mobile);
      //   uni.showToast({
      //     title: this.$t("login.invalid_phone_msg"),
      //     duration: 2000,
      //     icon: "none"
      //   });
      //   return;
      // }
      if (self.is_login == 2) {
        if (self.sms_open && self.formData.code == "") {
          uni.showToast({
            title: this.$t("login.code_required"),
            duration: 2000,
            icon: "none"
          });
          return;
        }
        formdata.code = self.formData.code;
        url = "user/userOpen/smsLogin";
      } else {
        formdata.password = self.formData.password;
        if (self.formData.password == "") {
          uni.showToast({
            title: this.$t("login.password_required"),
            duration: 2000,
            icon: "none"
          });
          return;
        }
        url = "user/userOpen/phoneLogin";
      }

      // if (!self.isRead) {
      // 	uni.showToast({
      // 		title: '请同意并勾选协议内容',
      // 		duration: 2000,
      // 		icon: 'none'
      // 	});
      // 	return;
      // }

      uni.showLoading({
        title: this.$t("login.submitting")
      });
      console.log("start");
      self._post(url, formdata, result => {
        console.log("start1");
        console.log(result);
        // 记录token userId
        uni.setStorageSync("token", result.data.token);
        uni.setStorageSync("userId", result.data.loginUserVo.userId);
        // 获取登录前页面
        let url = "/" + uni.getStorageSync("currentPage");
        let pageOptions = uni.getStorageSync("currentPageOptions");
        if (Object.keys(pageOptions).length > 0) {
          url += "?";
          for (let i in pageOptions) {
            url += i + "=" + pageOptions[i] + "&";
          }
          url = url.substring(0, url.length - 1);
        }

        // 执行回调函数
        self.gotoPage(url);
      }, false, () => {
        uni.hideLoading();
      });
    },
    // resetpasswordSub() {
    // 	let self = this;
    // 	if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.resetpassword.mobile)) {
    // 		uni.showToast({
    // 			title: '手机有误,请重填！',
    // 			duration: 2000,
    // 			icon: 'none'
    // 		});
    // 		return;
    // 	}
    // 	if (self.resetpassword.code == '') {
    // 		uni.showToast({
    // 			title: '验证码不能为空！',
    // 			duration: 2000,
    // 			icon: 'none'
    // 		});
    // 		return;
    // 	}
    // 	if (self.resetpassword.password.length < 6) {
    // 		uni.showToast({
    // 			title: '密码至少6位数！',
    // 			duration: 2000,
    // 			icon: 'none'
    // 		});
    // 		return;
    // 	}
    // 	if (self.resetpassword.password !== self.resetpassword.repassword) {
    // 		uni.showToast({
    // 			title: '两次密码输入不一致！',
    // 			duration: 2000,
    // 			icon: 'none'
    // 		});
    // 		return;
    // 	}

    // 	// if (!self.isRead) {
    // 	// 	uni.showToast({
    // 	// 		title: '请同意并勾选协议内容',
    // 	// 		duration: 2000,
    // 	// 		icon: 'none'
    // 	// 	});
    // 	// 	return;
    // 	// }

    // 	// self.register.invitationId = uni.getStorageSync('invitationId') ? uni.getStorageSync('invitationId') : 0;
    // 	// self.register.regSource = 'h5';
    // 	// self.register.refereeId = uni.getStorageSync('refereeId');

    // 	uni.showLoading({
    // 		title: '正在提交'
    // 	});
    // 	self._postBody(
    // 		'user/userOpen/register',
    // 		self.register,
    // 		result => {
    // 			uni.showToast({
    // 				title: '重置成功',
    // 				duration: 3000
    // 			})
    // 			self.formData.mobile = self.resetpassword.mobile;
    // 			self.register = {
    // 				mobile: '',
    // 				password: '',
    // 				repassword: '',
    // 				code: ''
    // 			};
    // 			self.second=0;
    // 			self.changeMsg();
    // 			self.is_login = 1;
    // 		},
    // 		false,
    // 		() => {
    // 			uni.hideLoading();
    // 		}
    // 	);
    // },
    resetpasswordSub() {
      let self = this;
      if (self.resetpassword.mobile == "") {
        uni.showToast({
          title: self.$t('user.enter_mobile_number'),
          duration: 1000,
          icon: "none",
        });
        return false;
      }
      // if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.resetpassword.mobile)) {
      //   uni.showToast({
      //     title: this.$t("login.invalid_phone_msg"),
      //     duration: 2000,
      //     icon: "none"
      //   });
      //   return;
      // }
      if (self.resetpassword.code == "") {
        uni.showToast({
          title: this.$t("login.code_required"),
          duration: 2000,
          icon: "none"
        });
        return;
      }
      if (self.resetpassword.password.length < 6) {
        uni.showToast({
          title: this.$t("login.password_min6_msg"),
          duration: 2000,
          icon: "none"
        });
        return;
      }
      if (self.resetpassword.password !== self.resetpassword.repassword) {
        uni.showToast({
          title: this.$t("login.password_mismatch"),
          duration: 2000,
          icon: "none"
        });
        return;
      }
      uni.showLoading({
        title: this.$t("login.submitting")
      });
      self._post("user/userOpen/resetpassword", self.resetpassword, result => {
        uni.showToast({
          title: this.$t("login.reset_successful"),
          duration: 3000
        });
        self.formData.mobile = self.resetpassword.mobile;
        self.resetpassword = {
          mobile: "",
          password: "",
          repassword: "",
          code: ""
        };
        self.second = 0;
        self.changeMsg();
        self.is_login = 1;
      }, false, () => {
        uni.hideLoading();
      });
    },
    isCode() {
      if (this.is_code) {
        this.is_code = false;
      } else {
        this.is_code = true;
      }
      console.log(this.is_code);
    },
    /*发送短信*/
    sendCode() {
      let self = this;
      if (self.is_login != 0) {
        if (self.formData.mobile == "") {
          uni.showToast({
            title: self.$t('user.enter_mobile_number'),
            duration: 1000,
            icon: "none",
          });
          return false;
        }
        // if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.formData.mobile)) {
        //   uni.showToast({
        //     title: this.$t("login.invalid_phone_msg"),
        //     duration: 2000,
        //     icon: "none"
        //   });
        //   return;
        // }
      } else if (self.is_login == 0) {
         if (self.resetpassword.mobile == "") {
          uni.showToast({
            title: self.$t('user.enter_mobile_number'),
            duration: 1000,
            icon: "none",
          });
          return false;
        }
        // if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.resetpassword.mobile)) {
        //   uni.showToast({
        //     title: this.$t("login.invalid_phone_msg"),
        //     duration: 2000,
        //     icon: "none"
        //   });
        //   return;
        // }
      }

      // let type = 'register'
      // let mobile = self.register.mobile
      // if (self.is_login == 1) {
      // 	type = 'login';
      // 	mobile = self.formData.mobile;
      // } else if (self.is_login == 0) {
      // 	type = 'login';
      // 	mobile = self.resetpassword.mobile;
      // }
      let type = "sms";
      let mobile = self.formData.mobile;
      if (self.is_login == 0) {
        mobile = self.resetpassword.mobile;
        let type = "login";
      }
      self._post("user/userOpen/sendCode", {
        mobile: mobile,
        type: type
      }, result => {
        if (result.code == 1) {
          uni.showToast({
            title: this.$t("login.send_successful")
          });
          self.is_send = true;
          self.changeMsg();
        }
      });
    },
    /*改变发送验证码按钮文本*/
    changeMsg() {
      if (this.second > 0) {
        this.send_btn_txt = this.second + this.$t("login.seconds");
        this.second--;
        setTimeout(this.changeMsg, 1000);
      } else {
        this.send_btn_txt = this.$t("login.get_verification_code");
        this.second = 60;
        this.is_send = false;
      }
    }
    // xieyi(type) {
    // 	let url = '';
    // 	if(type == 'service'){
    // 		url = this.service;
    // 	}else{
    // 		url = this.privacy;
    // 	}
    // 	uni.navigateTo({
    // 		url: '/pages/webview/webview?url=' + url
    // 	});
    // }
  }
};
</script>

<style lang="scss" scoped>
page {
  background: #ffffff;
}

@import "./login.scss";
</style>
